<template>
  <div>
    <mytop :title="title" />
    <div class="warp">
      <van-contact-card
        :type="type"
        :name="order.contact.name"
        :tel="order.contact.tel"
        @click="onEdit"
      />
      <van-card
        v-for="item in order.items"
        :key="item.id"
        :num="item.num"
        :price="item.minPrice"
        :desc="item.characteristic"
        :title="item.name"
        :thumb="item.pic"
      >
      </van-card>
      <van-submit-bar :price="order.total*100" button-text="提交订单" @submit="onSubmit" />
    </div>
  </div>
</template>

<script>
import mytop from 'components/My-Top'
import { mapState } from 'vuex'
import { Toast } from 'vant'
export default {
  name: 'order',
  data () {
    return {
      title: '确认订单'
    }
  },
  methods: {
    onEdit () {
      if (this.type === 'edit') {
        this.$router.push('/addressList')
      } else {
        this.$router.push('/addressAdd')
      }
    },
    onSubmit () {
      if (this.type === 'edit') {
        Toast('请等待收货')
      } else {
        Toast('请选择联系人')
      }
    }
  },
  computed: {
    ...mapState({
      order: (state) => state.order.currentOrder,
      address: state => state.address.address
    }),
    type () {
      return this.order.contact.name ? 'edit' : 'add'
    }
  },
  components: {
    mytop
  }
}
</script>

<style lang="scss" scoped>
.warp {
  margin-top: 46px;
  margin-bottom: 50px;
}
</style>
